﻿
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>UserInfo</title>
    <link rel="stylesheet" href="~/Web/css/user.css" />
</head>
<body>

    <div class="container-lg userInfo">
        <div class="row">
            <div class="col-md-2 userList">
                <ul>
                    <li class="onceInfo">
                        <a href="javascript:void">个人资料</a>
                    </li>
                    <li class="accSet">
                        <a href="javascript:void">账户设置</a>
                    </li>

                    <li class="myArticle">
                        <a href="javascript:void">我的贴子</a>
                    </li>
            </div>

            <div class="col-md-9 user-cz" style="margin-left: 14px; background-color: #ffffff;">
                <div class="row">
                    <div class="col-md-2 onceUser-img">
                        @*<img src="~/Web/Image/UserDefaultHead.png" alt="">*@
                    </div>

                    <div class="col-md-10 user-details">
                        <div>
                            @*<span>冰阔落吖</span>*@
                        </div>
                    </div>
                </div>

                <div class="row" style="height: 10px; background-color: #f0f0f0;"></div>

                <div class="row">
                    <div class="col-md-12 jbInfo">
                        
                    </div>

                    <div class="col-md-12 user-set">
                        
                    </div>


                    <div class="col-md-12 user-article">
                        
                    </div>

                </div>
            </div>
        </div>
    </div>

    <div style="height: 100px;"></div>


    
    <script src="~/Web/bootstrap-4.6.1-dist/js/jquery.js"></script>
    <script src="~/Web/bootstrap-4.6.1-dist/js/bootstrap.js"></script>
    <script>
        $(document).ready(function() {
            $(".onceInfo").css("background", "#f0f0f5");
            $.get("../../Home/GetUserInfo",function(data){
                var str = "";
                str += "<div class='row' style='border-bottom: 1px solid #e8e8ed;'>";
                str += "<div class='col-md-12 jbInfo-show'>";
                str += "<div class='user-jbInfo'>";
                str += "<span>基本信息</span>";
                str += "</div>";
                str += "<div class='update-info'>";
                str += "<a href='javascript:void(0);' id='upd'>";
                str += "<span>编辑</span>";
                str += "</a>";
                str += "</div>";
                str += "</div>";
                str += "</div>";
                str += "<div class='row Infojg'>";
                str += "<div class='col-md-12'>";

                str += "<form action='../../Home/EditUserInfo' enctype='multipart/form-data' method='post'>";
                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>用户昵称</span>";
                str += "</div>";
                str += "<div class='col-md-4'>";
                str += "<input type='text' name='nickName' id='' value='"+ data.nickName +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span onclick=''>真实姓名</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='realName' id='' value='"+ data.realName +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>出生日期</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='birthday' id=''value='"+ data.birthday +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>性别</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='gender' id=''value='"+ data.gender +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>微信号</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='weChat' id=''value='"+ data.weChat +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>手机号</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='tel' id='' value='"+ data.tel +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>家庭住址</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='address' id='' value='"+ data.address +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='row'><button class='btn btn-primary updateUserInfo' style='width:180px;margin-left:324px; margin-bottom:22px; display:none;'>提交</button></div>";
                str += "</form>";


                str += "</div>";
                str += "</div>";
                str += "</div>";
                $(".jbInfo").html(str);


                let strImage = "";
                    strImage += "<img src='../../Web/Image/"+ data.photo +"' name='photo' alt=''>";
                let strName = "";
                    strName += "<span>"+ data.nickName +"</span>";
                    $(".onceUser-img").html(strImage);
                    $(".user-details>div").html(strName);

                    $("#upd").click(function(){
                        $(".updateUserInfo").show();
                        $("input[type='text']").removeAttr("readonly");
                    });
            },"json");
        });

        $(".onceInfo").click(function() {
            $(".user-set").empty();
            $(".user-article").empty();
            
            $.get("../../Home/GetUserInfo",function(data){
                var str = "";
                str += "<div class='row' style='border-bottom: 1px solid #e8e8ed;'>";
                str += "<div class='col-md-12 jbInfo-show'>";
                str += "<div class='user-jbInfo'>";
                str += "<span>基本信息</span>";
                str += "</div>";
                str += "<div class='update-info'>";
                str += "<a href='javascript:void(0);' id='upd'>";
                str += "<span>编辑</span>";
                str += "</a>";
                str += "</div>";
                str += "</div>";
                str += "</div>";
                str += "<div class='row Infojg'>";
                str += "<div class='col-md-12'>";

                str += "<form action='../../Home/EditUserInfo' enctype='multipart/form-data' method='post'>";
                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>用户昵称</span>";
                str += "</div>";
                str += "<div class='col-md-4'>";
                str += "<input type='text' name='nickName' id='' value='"+ data.nickName +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span onclick=''>真实姓名</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='realName' id='' value='"+ data.realName +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>出生日期</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='birthday' id=''value='"+ data.birthday +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>性别</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='gender' id=''value='"+ data.gender +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>微信号</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='weChat' id=''value='"+ data.weChat +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>手机号</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='tel' id='' value='"+ data.tel +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>家庭住址</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='address' id='' value='"+ data.address +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                str += "<div class='row'><button class='btn btn-primary updateUserInfo' style='width:180px;margin-left:324px; margin-bottom:22px; display:none;'>提交</button></div>";
                str += "</form>";


                str += "</div>";
                str += "</div>";
                str += "</div>";
                $(".jbInfo").html(str);

                $("#upd").click(function(){
                    $(".updateUserInfo").show();
                    $("input[type='text']").removeAttr("readonly");
                });

            },"json");
        });

        $(".accSet").click(function() {
            $(".jbInfo").empty();
            $(".user-article").empty();
            $.get("../../Home/GetUserInfo",function(data){
                var str = "";
                str += "<div class='row' style='border-bottom: 1px solid #e8e8ed;'>";
                str += "<div class='col-md-12 jbInfo-show'>";
                str += "<div class='user-jbInfo'>";
                str += "<span>账号设置</span>";
                str += "</div>";
                str += "<div class='update-info'>";
                str += "<a href='javascript:void(0);'>";
                str += "<span id='reSetAP'>编辑</span>";
                str += "</a>";
                str += "</div>";
                str += "</div>";
                str += "</div>";
                str += "<div class='row Infojg'>";
                str += "<div class='col-md-12'>";
                str += "<form action='../../Home/UpdateUserAP' method='post'>";
                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>微信号</span>";
                str += "</div>";
                str += "<div class='col-md-4'>";
                str += "<input type='text' name='weChat' id='' value='"+ data.weChat +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";
                str += "<div class='user-jb-info'>";
                str += "<div class='row'>";
                str += "<div class='col-md-2'>";
                str += "<span>手机号</span>";
                str += "</div>";
                str += "<div class='col-md-10'>";
                str += "<input type='text' name='tel' id='' value='"+ data.tel +"' placeholder='未填写' readonly>";
                str += "</div>";
                str += "</div>";
                str += "</div>";
                str += "<div class='row'><button class='btn btn-primary updateUserAP' style='width:180px;margin-left:324px; margin-bottom:22px; display:none;'>提交</button></div>";
                str += "</form>";
                str += "</div>";
                str += "</div>";
                str += "</div>";
                $(".user-set").html(str);

                $("#reSetAP").click(function()
                {
                    $(".updateUserAP").show();
                    $("input[type='text']").removeAttr("readonly");
                });


            },"json");
        });
        $(".myArticle").click(function() {
            $(".jbInfo").empty();
            $(".user-set").empty();

            $.get("../../Home/GetUserArticle",function(data)
            {
                console.log(data);

                var str = "";
                str += "<div class='row' style='border-bottom: 1px solid #e8e8ed;'>";
                str += "<div class='col-md-12 jbInfo-show'>";
                str += "<div class='user-jbInfo'>";
                str += "<span>发布文章</span>";
                str += "</div>";
                str += "</div>";
                str += "</div>";

                for(let i = 0; i < data.length; i++)
                {
                    str += "<div class='row'>";
                    str += "<div class='col-md-12' style='padding:0; border-bottom: solid 1px #E8E8ED;'>";
                    str += "<div class='article-box'>";
                    str += "<a href='article.html' class='article-title-link'>";
                    str += "<div class='article-title'>";
                    str += "<span>"+ data[i].title +"</span>";
                    str += "</div>";
                    str += "</a>";
                    str += "<a href='../../Home/Article/"+ data[i].id +"' class='article-details-link'>";
                    str += "<div class='row'>";
                    str += "<div class='col-md-2'>";
                    str += "<img src='../../Web/Cover/"+ data[i].photo +"' alt='' width='120px' height='60px'>";
                    str += "</div>";
                    str += "<div class='col-md-10' style='padding: 0;''>";
                    str += "<div class='article-details'>";
                    str += "<div class='col-md-10' style='padding: 0;'>";
                    str += "<span>"+ data[i].context +"</span>";
                    str += "</div>";
                    str += "</div>";
                    str += "</div>";
                    str += "</div>";
                    str += "</a>";
                    str += "</div>";
                    str += "</div>";
                    str += "</div>";
                }
                $(".user-article").html(str);

            },"json");
        });

        $(".userList li").click(function() {
            $(this).siblings().css("background", "");
            $(this).css("background", "#f0f0f5");
        });

    </script>

</body>
</html>
